/* 
rtsp-relay插件不需要安装ffmepg应该是提取了转mepg格式有关核心，其实也是利用ffmepg将rtsp转mepg （是 ws+@ffmpeg-installer/ffmpeg+child_process），
然后用ws发送，前端使用 jsmpeg插件解读mpeg格式流播放视频。此链接操作原理 https://my.oschina.net/chengpengvb/blog/1832469 就是原理


*/

const express = require('express');
const app = express();

const { proxy, scriptUrl } = require('rtsp-relay')(app);

const handler = proxy({
  url: `rtsp://admin:gw110110@10.4.1.199:554`,
  verbose: false,
  // additionalFlags : [ '-q' ,  '1' ],  //尝试提升视频质量，1-200之间，1最好但延迟高，建议9
  transport : 'tcp'  //尝试提升视频质量
});

// the endpoint our RTSP uses
app.ws('/api/stream', handler);

app.get('/', (req, res) =>
  res.send(`
  <h1>测试</h1>
  <canvas id='canvas'></canvas>

  <script src='${scriptUrl}'></script>
  <script>
    loadPlayer({
      url: 'ws://' + location.host + '/api/stream',
      canvas: document.getElementById('canvas')
    });
  </script>
`),
);
/* 
这里演示是后端渲染，如果前台渲染vue引入 https://cdn.jsdelivr.net/gh/phoboslab/jsmpeg@9cf21d3/jsmpeg.min.js ，
使用 loadPlayer函数，如果报错听说要有 脚手架例如webpack / vite之类才能用loadPlayer函数，如果原生js也可以用下面方法：
let canvas = this.$el.getElementsByTagName("canvas")[0];
        if (!canvas) {
          const canvasWrapper = document.getElementById("canvas-wrapper");
          canvas = document.createElement("canvas");
          canvas.style.zIndex = "9999";
          canvas.style.width = "auto";
          canvas.style.maxHeight = "100%";
          canvas.style.background = "none";
          canvasWrapper.appendChild(canvas);
        }
        const proxyUrl = `ws://127.0.0.1:8888/rtsp?url=${url}`;
        if (canvas) {
          this.player = new JSMpeg.Player(proxyUrl, {
            canvas,
            videoBufferSize: 4 * 1024 * 1024,
          });
        }
*/



app.listen(2000,()=>{
    console.log("监听2000");
});